<template>



    <div class="box">
        <h1>{{course.name}}</h1>

        <video w-full :src="course.video" controls class="preview"></video>

    </div>

</template>

<script setup>
    import {ref, reactive, onMounted} from "vue"
    import {useRouter, useRoute} from 'vue-router'

    const route = useRoute()
    import axios from 'axios'

    const course = ref({})

    onMounted(async () => {
        const res = await axios.get('/course/findById?id=' + route.query.id)
        course.value = res.data.data
    })


</script>

<style scoped>

    .box {
        width: 1200px;
        height: 1000px;
        margin: 0 auto;
        background-color: skyblue;
    }

</style>
